<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link rel="stylesheet" href="/bootstrap/css/bootstrap.min.css" crossorigin="anonymous">
    <style>

        .sidebar{
            float: left;
            width: 100px;
            height: 100px;
            background-color: #f0f0f0;
            padding: 5px;
            display: flex;
            flex-direction: column;
            text-align: center;
            text-decoration: none;
        }

        .footer{
            text-align: center;
            background-color: #86cfda;
            padding: 50px;
            font-size: 32px;

        }
        .table{

            flex: 1;
        }

        .head{
            background-color: #86cfda;
            height: 140px;
            width: 100%;
            display: flex;
            flex-direction: column;
            justify-content: space-between;
        }
        .text{
            margin-left: 10px;
            font-size: 50px;
            display: flex;
            align-items: center;
            letter-spacing: 5px;
        }
        .quit{
            font-size: 15px;
            display: flex;
            align-items: flex-end;
            justify-content: flex-end;
            padding: 5px;
            height: 50px;
        }
        .page-item{

            list-style-type: none;
        }
        .pagination{
            display: flex;
            flex-direction: row;
        }
    </style>
</head>
<body>
<div class="head">
    <div class="text"><a th:text="${session.role}"></a>管理系统</div>
    <div class="quit">
        <div style="flex-direction: column;">欢迎你,<h3 th:text="${session.username}" style="margin: 0"/></div>
        <a th:href="@{/loginout}" style="padding-left: 15px;text-decoration: none;font-size: 20px">退出</a>
    </div>
</div>
<div>
    <div class="sidebar">
        <a th:href="@{/Student/list/1/3}">学生</a>
        <a th:href="@{/Teacher/list/1/3}">教师</a>
        <a th:href="@{/Course/list/1/3}">课程</a>
    </div>
    <table class="table" >

        <thead class="thead-dark">
        <tr>
            <th scope="col">id</th>
            <th scope="col">name</th>
            <th scope="col">password</th>
            <th scope="col">sex</th>
            <th scope="col">class</th>
            <th scope="col">birthday</th>
            <th scope="col">成绩</th>
            <th scope="col">操作</th>
        </tr>
        </thead>
        <tbody>
        <tr th:each="student:${students}">
            <th th:text="${student.id}"></th>
            <td th:text="${student.name}"></td>
            <td th:text="${student.password}"></td>
            <td th:text="${student.sex==1?'男':'女'}"></td>
            <td th:text="${student.clazz}"></td>
            <td th:text="${student.birthday}"></td>
            <td>
                <a th:href="@{/Student/toEdit(id=${student.id})}">修改</a>
                <a th:href="@{/Student/remove(id=${student.id})}">删除</a>
            </td>
        </tr>
        </tbody>
    </table>
</div>

<nav aria-label="Page navigation example">
    <ul class="pagination">
        <li class="page-item" th:classappend="${current == 1}? 'disabled'">
            <a class="page-link" th:href="@{/Student/list(current=${current - 1}, size=${size})}" aria-label="Previous">
                <span aria-hidden="true">prior|</span>
            </a>
        </li>
        <li class="page-item" th:each="i: ${#numbers.sequence(1, pages)}" th:classappend="${i == current}? 'active'">
            <a class="page-link" th:href="@{/Student/list(current=${i}, size=${size})}" th:text="${i}+'|'"></a>
        </li>
        <li class="page-item" th:classappend="${current == pages}? 'disabled'">
            <a class="page-link" th:href="@{/Student/list(current=${current + 1}, size=${size})}" aria-label="Next">
                <span aria-hidden="true">next</span>
            </a>
        </li>
    </ul>
</nav>

<div class="footer">我来组成尾气</div>
</body>
</html>